<template>
	<view class="mask">
		<view class="contentbox">
			<view class="closelogo" @click="closeFn">
				<img src="https://image.alhelp.net/uploads/20231104/4f0e70da3686154b6f82f82e1a320fd6.png" alt="">
			</view>
			<view class="content">
				<slot></slot>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				
			}
		},
		methods:{
			closeFn(){
				this.$emit('closeFn')
			}
		}
	}
</script>

<style lang="scss" scoped>
	.mask{
		z-index: 10;
		 position: fixed;
		  left: 0;
		  top: 0;
		  right: 0;
		  bottom: 0;
			display: flex;
		  justify-content: center;
		  align-items: center;
		  background-color: rgba(0, 0, 0, 0.4);
			.contentbox{
				border-radius: 30rpx;
				  width: 652rpx;
					box-sizing: border-box;
				  background-color:#ffffff;
				  display: flex;
				  flex-direction: column;
				  padding: 52rpx 70rpx;
					position: relative;
					.closelogo{
						position: absolute;
						right: -25rpx;
						top:-25rpx;
						width: 75rpx;
						height: 75rpx;
						image{
							width: 100%;
							height: 100%;
						}
					}
					.content{
						width: 100%;
						height: 100%;
						 display: flex;
						    justify-content: center;
						    align-items: center;
								flex-direction: column;
					}
			}
	}
	
</style>